import React, { useState } from 'react'
import { Link } from 'react-router-dom'

export default function RegisterID () {
  const [PhoneNum, setPhoneNum] = useState('')
  const [password, setpassword] = useState('')
  const onChangePhoneNum = (e) => { setPhoneNum(e.target.value) }
  const onChangePassword = (e) => { setpassword(e.target.value) }
  return (
    <div>
      {/* <!--头部--> */}
      <div className="register_top">
        <Link to={'/home'}>
          <i className="iconfont font22">&#xe609;</i>
          <i>手机号注册</i>
        </Link>
      </div>

      {/* <!--内容--> */}
      <div className="content">
        <form action="" method="post">
          <p className="iconfont font22">&#xe605;<span>+86</span><input type="text" onChange={onChangePhoneNum} value={PhoneNum} placeholder="输入手机号" /></p>
          <p className="iconfont font22">&#xe603;<input type="password" onChange={onChangePassword} value={password} placeholder="设置登录密码，不少于6位" /></p>
          <input type="submit" value="下一步" />
        </form>

      </div>

      {/* <!--脚部--> */}
      <div className="register_footer">
        <div className="register_footer_top">
          <div className="register_footer_top_left"></div>
          <p>其他注册方式</p>
          <div className="register_footer_top_right"></div>
        </div>
        <div className="register_footer_content">
          <a href="#">
            <p className="iconfont font22">&#xe616;</p>
            <p>微信</p>
          </a>
          <a href="#">
            <p className="iconfont font22">&#xe61d;</p>
            <p>微信</p>
          </a>
          <a href="#">
            <p className="iconfont font22">&#xe7e4;</p>
            <p>微信</p>
          </a>
          <a href="#">
            <p className="iconfont font22">&#xe77a;</p>
            <p>微信</p>
          </a>
        </div>
      </div>
    </div>
  )
}
